﻿@model thailandProject.Models.CLIENT

@{
    ViewBag.Title = "Add Client";
}

<div id="Wrapper2">
    <div id="content_header">
        <div id="headerimage">
        </div>
        <div id="theheader">@ViewBag.Header</div>
    </div>
    <!-- Left Column begins here -->
    <aside id="sidebar-wrapper">
        <nav class="sidebar">
            <!-- CONTENT GOES HERE -->
            @using (Html.BeginForm("AddClient", "Clients", FormMethod.Post, new { id = "addForm" }))
            {
    @Html.ValidationSummary(true)

        <div class="editor-label">
            <label for="firstname">First Name</label>
        </div>
        <div class="editor-field">
            <input type="text" id="clientFirstName" name="clientFirstName" maxlength="50" />
        </div>
        <div id="clientFirstNameError" style="color:red; visibility:hidden;">First name must not be empty</div>

        <div class="editor-label">
            <label for="lastname">Last Name</label>
        </div>
        <div class="editor-field">
            <input type="text" id="clientLastName" name="clientLastName" maxlength="50" />
        </div>

        <div class="editor-label">
            <label for="email">Email</label>
        </div>
        <div class="editor-field">
            <input type="text" id="clientEmail" name="clientEmail" maxlength="50" />
        </div>
        <div id="clientEmailError" style="color:red; visibility:hidden;">Email must not be empty</div>

        <div id="addmore">Add more client information...</div>

        <div id="otherelements" style="display:none">

            <div class="editor-label">
                <label for="address">Address</label>
            </div>
            <div class="editor-field">
                <input type="text" id="clientAddress" name="clientAddress" maxlength="50" />
            </div>

            <div class="editor-label">
                <label for="city">City</label>
            </div>
            <div class="editor-field">
                <input type="text" id="clientCity" name="clientCity" maxlength="50" />
            </div>

            <div class="editor-label">
                <label for="city">State/Providence</label>
            </div>
            <div class="editor-field">
                <input type="text" id="clientStateProvidence" name="clientStateProvidence" maxlength="50" />
            </div>

            <div class="editor-label">
                <label for="passport">Passport No.</label>
            </div>
            <div class="editor-field">
                <input type="text" id="clientPassportNum" name="clientPassportNum" maxlength="10" />
            </div>

            <div class="editor-label">
                <label for="notes">Memo</label>
            </div>
            <div class="editor-field">
                <textarea id="clientNotes" name="clientNotes"></textarea>
                <span id="charsLeft">&nbsp;</span>
            </div>
        </div>
        
        <p style="float:left; width:100%;">
            <input type="hidden" id="reactivateclient" name="reactivateclient" value="-1" />
            <input type="image" src="../../images/create_button.png" value="Create" />
            <input type="hidden" id="formcheck" value="false" />
            <span id="formError" style="color:red; visibility:hidden">Please correct the above errors to continue</span>
        </p>

            }

<div>
    @Html.ActionLink("Back to List", "Index")
</div>
            
        </nav>
    </aside>
    <!-- Right column begins here -->
    <article id="contents">
        Add a new client to the database. The only required fields are the client's <strong>first name</strong> and <strong>email address</strong>.
        <br />If more data is available, click "Add more client information..."
    </article>
    <!-- Right column ends here -->
</div>
<!-- Div wrapper2 ends here -->

<script>
    $("#addForm").submit(function () {
        //Make sure the first name and email fields are not empty
        var isValid = true;

        if ($("#clientFirstName").val() == "") {
            $("#clientFirstNameError").attr('style', 'color:red; visibility:visible;');
            isValid = false;
            $("#clientFirstName").focus();
        }
        else
            $("#clientFirstNameError").attr('style', 'color:red; visibility:hidden;');

        if ($("#clientEmail").val() == "") {
            $("#clientEmailError").attr('style', 'color:red; visibility:visible;');

            if (isValid)
                $("#clientEmail").focus();

            isValid = false;
        }
        else
            $("#clientEmailError").attr('style', 'color:red; visibility:hidden;');

        if (isValid) {
            $("#formError").attr('style', 'color:red; visibility:hidden;');

            if ($("#formcheck").val() == 'false') {
                $("#formcheck").val('true');
                return true;
            }
            else {
                alert('Your action is currently being processed. Please wait');
                return false;
            }
        }
        else {
            $("#formError").attr('style', 'color:red; visibility:visible;');
            return false;
        }
    })

    $("#clientNotes").keyup(function () {
        var message = $(this).val();

        if (message.length > 2000) {
            message = message.substr(0, 2000);
            $(this).val(message);
        }

        $("#charsLeft").text(2000 - message.length + " chars left");
    })
</script>

<script type="text/javascript">
    $("document").ready(function () {
        $("#addmore").toggle(function () {
            $("#otherelements").css('display','');
            $("#addmore").html('Remove client information below...');
        }, function () {
            $("#otherelements").css('display', 'none');
            $("#addmore").html('Add more client information...');
        });

        $("#clientEmail").focusout( function () {
            //On loss of focus, run an ajax query to see if that user's email exists
            $.ajax({
                url: "/clients/AddClientQuickSearch", type: "POST", dataType: "json",

                data: "email=" + $("#clientEmail").val(),

                success: function (name) {
                    if (name == "false") {
                        //$("#clientFirstName").val("");
                        //$("#clientLastName").val("");
                        $("#reactivateclient").val("-1");
                        return;
                    }

                    //Fill in the fields with the returned info
                    var value;
                    name = name.substr(1, name.length); //Bypass the first {
                    value = name.substr(0, name.indexOf("}"));
                    $("#reactivateclient").val(value);

                    name = name.substr(value.length + 2, name.length); //Bypass the "}{"
                    value = name.substr(0, name.indexOf("}"));
                    $("#clientFirstName").val(value);

                    name = name.substr(value.length + 2, name.length); //Bypass the "}{"
                    value = name.substr(0, name.indexOf("}"));
                    $("#clientLastName").val(value);

                    name = name.substr(value.length + 2, name.length); //Bypass the "}{"
                    value = name.substr(0, name.indexOf("}"));
                    $("#clientAddress").val(value);

                    name = name.substr(value.length + 2, name.length); //Bypass the "}{"
                    value = name.substr(0, name.indexOf("}"));
                    $("#clientCity").val(value);

                    name = name.substr(value.length + 2, name.length); //Bypass the "}{"
                    value = name.substr(0, name.indexOf("}"));
                    $("#clientStateProvidence").val(value);

                    name = name.substr(value.length + 2, name.length); //Bypass the "}{"
                    value = name.substr(0, name.indexOf("}"));
                    $("#clientPassportNum").val(value);

                    name = name.substr(value.length + 2, name.length); //Bypass the "}{"
                    value = name.substr(0, name.indexOf("}"));
                    $("#clientNotes").val(value);

                    alert("A deleted client with this email address has been found. Press the create button to restore this client.");
                }
            });
        })
    })
</script>